<?php
/* @var $this ObservationController */
/* @var $model Observation */
/* @var $form CActiveForm  */

$this->pageTitle=Yii::app()->name . ' - Toevoegen';
$this->breadcrumbs=array(
	'Toevoegen',
);
?>
<h1>Toevoegen</h1>

<p>Vul het waarnemingformulier in om een waarneming toe te voegen:</p>

<div class="form">
    <?php $form=$this->beginWidget('CActiveForm', array(
	'id'=>'add-form',
	'enableClientValidation'=>true,
    'enableAjaxValidation'=>true,
	'clientOptions'=>array(
		'validateOnSubmit'=>true,
        ),
            'htmlOptions' => array('enctype' => 'multipart/form-data'),
    )); ?>
    
        <p class="note">Velden met een <span class="required">*</span> zijn verplicht.</p>
        
        <div class="row">
		<?php echo $form->labelEx($model,'observation_date'); ?>
        <?php $this->widget('zii.widgets.jui.CJuiDatePicker', array(
                'name'=>"Observation[observation_date]", // the name of the field
                'value'=>$model->observation_date,  // pre-fill the value
                // additional javascript options for the date picker plugin
                'options'=>array(
                        'showAnim'=>'fold',
                        'dateFormat'=>'dd-mm-yy',  // optional Date formatting
                        'debug'=>true,
                ),
                'htmlOptions'=>array(
                        'style'=>'height:20px;'
                ),
         )); ?>

		<?php echo $form->error($model,'observation_date'); ?>
	</div>
        <div class="row">
            <div class="cell append-1">
		<?php echo $form->labelEx($model,'observation_longitude'); ?>
		<?php echo $form->numberField($model,'observation_longitude'); ?>
		<?php echo $form->error($model,'observation_longitude'); ?>
            </div>
            <div class="cell append-1">
                <?php echo $form->labelEx($model,'observation_latitude'); ?>
		<?php echo $form->numberField($model,'observation_latitude'); ?>
		<?php echo $form->error($model,'observation_latitude'); ?>
            </div>
            <div class="clear"></div>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'seeing'); ?>
		<?php echo $form->textField($model,'seeing'); ?>
		<?php echo $form->error($model,'seeing'); ?>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'transparency'); ?>
		<?php echo $form->textField($model,'transparency'); ?>
		<?php echo $form->error($model,'transparency'); ?>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'groupsouth'); ?>
		<?php echo $form->numberField($model,'groupsouth'); ?>
		<?php echo $form->error($model,'groupsouth'); ?>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'spotsouth'); ?>
		<?php echo $form->numberField($model,'spotsouth'); ?>
		<?php echo $form->error($model,'spotsouth'); ?>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'groupnorth'); ?>
		<?php echo $form->numberField($model,'groupnorth'); ?>
		<?php echo $form->error($model,'groupnorth'); ?>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'spotnorth'); ?>
		<?php echo $form->numberField($model,'spotnorth'); ?>
		<?php echo $form->error($model,'spotnorth'); ?>
	</div>
        <div class="row">
            <div class="cell append-1">
            <?php echo $form->labelEx($model,'telescope'); ?>
            <?php  echo $form->dropDownList($model, 'telescope', 
                            CHtml::listData(User::model()->findByPk(
                                    Yii::app()->user->id
                                )->telescopes, 'telescope_ID', 'name'), array(
                                'empty' => 'Selecteer telescoop',
                            )); ?>
            <?php echo $form->error($model,'telescope'); ?>
            </div>
            <div class="cell append-1">
            <label for="add_telescope">Telescoop toevoegen</label>
            <?php
            echo CHtml::button('Telescoop toevoegen', array(
                'onclick'=>'{addTelescope(); $("#mydialog").dialog("open");}',
                'id'=>'add_telescope',
            ))
            ?>
            </div>
            <div class="clear"></div>
	</div>
        <div class="row">
		<?php echo $form->labelEx($model,'image'); ?>
		<?php echo $form->fileField($model,'image'); ?>
		<?php echo $form->error($model,'image'); ?>
	</div>
        <div class="row buttons">
		<?php echo CHtml::submitButton('Toevoegen'); ?>
	</div>
</div>
<?php $this->endWidget(); ?>
</div><!-- form -->
<?php
$this->beginWidget('zii.widgets.jui.CJuiDialog', array(
    'id'=>'mydialog',
    // additional javascript options for the dialog plugin
    'options'=>array(
        'title'=>'Telescoop toevoegen',
        'autoOpen'=>false,
        'modal'=>true,
        'width'=>550,
        'height'=>470,
    ),
));
?>

<div class="divForForm"></div>

<?php
$this->endWidget('zii.widgets.jui.CJuiDialog');
?>

<script type="text/javascript">
// here is the magic, src: http://www.yiiframework.com/wiki/145/cjuidialog-for-create-new-model/
function addTelescope()
{
    <?php echo CHtml::ajax(array(
            'url'=>array('telescope/add'),
            'data'=> "js:$(this).serialize()",
            'type'=>'post',
            'dataType'=>'json',
            'success'=>"function(data)
            {
                if (data.status == 'failure')
                {
                    $('#mydialog div.divForForm').html(data.div);
                    // Here is the trick: on submit-> once again this function!
                    $('#mydialog div.divForForm form').submit(addTelescope);
                }
                else
                {
                    $('#mydialog div.divForForm').html(data.div);
                    var selectOption = $('#Observation_telescope option[value=\"'+data.telescope_ID+'\"]');
                    if(selectOption.length <= 0){
                        // Added new telescope, add to dropdownlist and select
                        $('#Observation_telescope')
                                .append($('<option>', { value : data.telescope_ID, selected : 'selected' })
                                        .text(data.telescope_name)
                                );
                    }else{
                        // Telescope already exists, select it
                        $(selectOption).attr('selected', 'selected');
                    }
                    // Show status confirmation, and close
                    setTimeout(\"$('#mydialog').dialog('close') \",500);
                }
 
            } ",
            ))?>;
    return false; 
 
}
 
</script>